<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    <title>商城高并发抢单-商品列表</title>

    <link th:href="@{/statics/plugins/bootstrap-3.3.0/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/statics/plugins/bootstrap-3.3.0/css/bootstrap-theme.min.css}" rel="stylesheet">
</head>

<body>
<div class="container">
    <div class="panel panel-default">
        <div class="panel-heading text-center">
            <h2>商城高并发抢单-秒杀商品列表</h2>
        </div>

        <div class="panel-body">
            <table class="table table-hover">
                <thead>
                <tr>
                    <td style="font-size: 15px"><strong style="color: red">商品名称</strong></td>
                    <td style="font-size: 15px"><strong style="color: red">剩余数量</strong></td>
                    <td style="font-size: 15px"><strong style="color: red">开始时间</strong></td>
                    <td style="font-size: 15px"><strong style="color: red">结束时间</strong></td>
                    <td style="font-size: 15px"><strong style="color: red">查看详情</strong></td>
                </tr>
                </thead>
                <tbody>
                <tr th:each="item:${list}">
                    <td><span th:text="${item.itemName}"></span></td>
                    <td><span th:text="${item.total}"></span></td>
                    <td>
                        <span th:text="${#dates.format(item.startTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                    </td>
                    <td>
                        <span th:text="${#dates.format(item.endTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                    </td>
                    <td>
                        <a th:if="${item.canKill} eq 1" class="btn btn-info" th:href="@{/item/detail/{id}(id=${item.id})}"
                           target="_blank">详情</a>
                        <a th:unless="${item.canKill} eq 1" class="btn btn-info">哈哈~商品已抢购完毕或者不在抢购时间段哦!</a>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
<script th:src="@{/statics/plugins/jquery.js}"></script>
<script th:src="@{/statics/plugins/bootstrap-3.3.0/js/bootstrap.min.js}"></script>
<script>

</script>
</html>